{% extends "handleui/base.html" %}    
{% block user %}
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true"> <img alt="" src="/static/handleui/img/avatar1_small.jpg"/> 
              <span class="username">{{ email }}</span> <i class="icon-angle-down"></i> </a>
          <ul class="dropdown-menu">
              <li><a href="login.html"><i class="icon-key"></i> 退出</a> </li>
          </ul>
{% endblock %}
{% block header %}
        <li> <a href="/results">扫描结果</a> </li>
        <li  class="active"> <a href="/queue"><span class="selected"></span>扫描队列</a> </li>
        <li> <a href="/infaq/">帮助中心</a> </li>
        <li> <a href="/inabout/">关于我们</a> </li>
{% endblock %}
{% block content %}
    <!-- BEGIN PAGE CONTENT-->
    <div class="row">
      <div class="col-md-12 responsive" data-tablet="col-md-12 fix-offset" data-desktop="col-md-12"> 
        <!-- BEGIN EXAMPLE TABLE PORTLET-->
        <div class="portlet box grey">
          <div class="portlet-title">
            <div class="caption"><i class="icon-user"></i>基本情况</div>
          </div>
          <div class="portlet-body">
            <table class="table table-striped table-bordered table-hover" id="sample_2">
              <thead>
                <tr>
                  <th style="width:8px;"><input type="checkbox" class="group-checkable" data-set="#sample_2 .checkboxes" /></th>
                  <th>IP</th>
                  <th>Email</th>
                  <th>使用者</th>
                  <th>扫描状态</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
                {% for myip,myemail,myname,mytaskid in myzip %}
                {% if mytaskid %}
                <tr class="odd gradeX">
                  <td><input type="checkbox" class="checkboxes" value="1" /></td>
                  <td class="myip">{{ myip }}</td>
                  <td>{{ myemail }}</td>
                  <td>{{ myname }}</td>
                  <td class="scantime">
                    <div class="progress progress-striped">
                      <div class="progress-bar" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
                              <span class="percent">
                                    {{ mytaskid }}
                              </span>
                      </div>
                    </div>
                  </td>
                  <td><li class="btn-group">
                      <button type="button" class="btn blue dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-delay="1000" data-close-others="true"> <span>操作</span> <i class="icon-angle-down"></i> </button>
                      <ul class="dropdown-menu pull-right" role="menu">
<!--                        <li><a href="/do_task/{{ myip }}/" id="do-task">再次扫描</a></li>-->
                        <li><a href="#" class="do-task">再次扫描</a></li>
                        <li><a href="#">发送结果到其邮箱</a></li>
                        <li><a href="/getresult/{{ myip }}/">查看扫描报告</a></li>
                        <li class="divider"></li>
                        <li><a href="#">下载扫描报告</a></li>
                      </ul>
                    </li></td>
                </tr>
                  {% endif %}
                {% endfor %}
              </tbody>
            </table>
          </div>

        </div>
        <!-- END EXAMPLE TABLE PORTLET--> 
      </div>
    </div>
    <!-- END PAGE CONTENT--> 
{% endblock %}
{% block extrascript %}

	<script type="text/javascript">
        function GetProgress(taskid,mypercent){
            $.ajax({
                url:"/poll_state/"+taskid,
                success:function(redata){
                    if(redata.process_percent) {
                        mypercent.css("width",redata.process_percent+"%");
                        mypercent.children().html(redata.process_percent+"%");
                        setTimeout(GetProgress(taskid,mypercent),2000);
                    } 
                    else {
                        mypercent.children().html(redata); 
                        if(redata!='SUCCESS')
                            setTimeout(GetProgress(taskid,mypercent),2000);
                        else
                            window.location.reload();
                    } 
                }
            });
        }
        jQuery(document).ready(function() {
                $(".percent").each(function(){
                    taskid=$(this).html().trim();
                    GetProgress(taskid,$(this).parent());
                    });
		});
	</script>
<!--    <script type="text/javascript">-->
<!--        $('.do-task').click(function(){-->
<!--            var scantime=$(this).parent().parent().parent().parent().parent().children(".scantime");-->
<!--            var myip=$(this).parent().parent().parent().parent().parent().children(".myip");-->
<!--            scantime.children().addClass('active');-->
<!--            var taskid="test";-->
<!--            $.get("/do_task/"+myip.html(),function(data,status){-->
<!--                });-->
<!--        });-->
<!--    </script>-->
{% endblock %}
